<template>
  <a-card :bordered='false' style='margin-top:24px'>
    <div class='ant-descriptions-title'>销售明细</div>
    <div class='table-page-search-wrapper'>
      <a-form layout='inline'>
        <a-row :gutter='24'>
          <a-col :md='4' :sm='24'>
            <a-form-item>
              <a-input placeholder='请输入收衣人姓名/手机号' v-model='queryParam.search' />
            </a-form-item>
          </a-col>
          <a-col :md='4' :sm='24'>
            <a-form-item>
              <a-input placeholder='请输入订单编号' v-model='queryParam.out_trade_no' />
            </a-form-item>
          </a-col>
          <a-col :md='4' :sm='24'>
              <span class='table-page-search-submitButtons'>
                <a-button type='primary' @click='handleSearch(true)' icon='search'>查询</a-button>
              </span>
          </a-col>
        </a-row>
      </a-form>
      <s-table
        ref='table'
        size='default'
        rowKey='id'
        :columns='columns'
        :data='loadData'
        :pagination='pagination'
        :pageSize='5'
      >
        <template slot='img_url' slot-scope='text'>
          <a-avatar shape='square' :size='64' icon='skin' :src='text' />
        </template>
        <a-badge
          :status='orderStatus(record.status)'
          :text='record | serveStatusFilter'
          slot='status'
          slot-scope='text, record'
        />
        <span slot='action' slot-scope='text, record'>
      <template>
        <a @click='handleEdit(record)'>详情</a>
      </template>
    </span>
      </s-table>
    </div>
  </a-card>
</template>

<script>
import formTableMixin from '@/mixins/formTableMixin'
import orderStatus from '@/mixins/orderStatus'
import { stewardWalletInfo } from '@/api/stat'
import { areaLink, cityLink, provinceLink } from '@/api/notControl'

const columns = [
  {
    title: '姓名',
    dataIndex: 'send_name'
  },
  {
    title: '手机号',
    dataIndex: 'send_mobile'
  },
  {
    title: '支付价格',
    dataIndex: 'price',
    customRender(text) {
      return '￥' + text
    }
  },
  {
    title: '服务地址',
    dataIndex: 'send_address'
  },
  {
    title: '订单号',
    dataIndex: 'out_trade_no'
  },
  {
    title: '时间',
    dataIndex: 'utime'
  },
  {
    title: '状态',
    dataIndex: 'status',
    scopedSlots: { customRender: 'status' }
  },
  {
    title: '操作',
    dataIndex: 'action',
    width: '150px',
    scopedSlots: { customRender: 'action' }
  }
]
export default {
  name: 'StewardWalletInfo',
  mixins: [formTableMixin, orderStatus],
  data() {
    this.columns = columns
    this.listAction = stewardWalletInfo
    return {
      loadingStat: false,
      wallet: {},
      cityList: [],
      provinceList: [],
      areaList: [],
      dateRange: []
    }
  },
  created() {
    provinceLink().then(res => {
      this.provinceList = res.data
    })
  },
  methods: {
    handleEdit (record) {
      this.$router.push({
        name: `clothesOrderDetail`,
        query: {
          id: record.id
        }
      })
    },
    dateRangeChange(e) {
      this.queryParam.atime = e[0].format('YYYY-MM-DD')
      this.queryParam.etime = e[1].format('YYYY-MM-DD')
    },
    onProvinceChange(provinceid, formId) {
      return cityLink({ provinceid }).then(res => {
        this.cityList = res.data
        this.queryParam.cityid = undefined
        this.queryParam.province = this.provinceList.find(item => item.provinceid === provinceid).province
      })
    },
    onCityChange(cityid, formId) {
      return areaLink({ cityid }).then(res => {
        this.areaList = res.data
        this.queryParam.areaid = undefined
        this.queryParam.city = this.cityList.find(item => item.cityid === cityid).city
      })
    }
  }
}
</script>

<style scoped>

</style>